<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">
  <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.css">
  <link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.css">
  <link rel="stylesheet" href="dist/css/AdminLTE.css">
  <link rel="stylesheet" href="dist/css/skins/_all-skins.css">
  <link rel="stylesheet" href="css/addcompact.css">
  <link rel="stylesheet" type="text/css" href="css/flatpickr.material_blue.min.css"/>
  <style type="text/css">
  	@media only screen and (min-width: 768px) {
  		.main-sidebar{
  			padding-top: 0.26rem;
  		}
  	}
  	
  	@media only screen and (max-width: 375px) {
  		.resultL {
		    width: 100% !important;
		    margin-bottom: 30px;
		}	
		.resultR{
  			margin-left:86px !important;
  		}
  		
  	}
  	@media only screen and (max-width: 1024px) {
  		.result{
  			width: 100%;
  			margin: 0.05rem auto 0px;
  		}
  		.resultL{
  			width: 80%;
  			margin: 20px auto 0px;
  		}
  		.resultL p:first-child{
			font-size: 0.1rem;
			height: 35px;
		}
  		.resultR{
  			width: 15%;
  			float: left;
  			margin-left: 0px;
  		}
  		.updateMar{
  			margin-left: 0px;
  			margin-right: 0px;
  		}
  		.col-md-6, .col-lg-6{
  			padding-left: 0px !important;
  			padding-right: 0px !important;
  		}
  		.box.box-solid.box-default.addBg > .box-header{
  			width: 96%;
  		}
  		.box-body{
  			padding: 14px;
  		}
  	}
  	@media only screen and (max-width: 768px ) {
  		.col-md-6, .col-lg-6{
  			padding-left: 0px !important;
  			padding-right: 0px !important;
  		}
  		.box.box-solid.box-default.addBg > .box-header{
  			width: 91%;
  		}
  		.addPadding{
  			padding: 0 22px !important;
  		}
  		.no-padding {
  			padding: 0 20px !important;
  		}
  	}
  	
  </style>
	</head>
	<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">

  <header class="main-header">
    <a href="#" class="logo">
      	<img src="img/jylogo.png" class="jylogo"/>
    </a>
    <nav class="navbar navbar-static-top">
      <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
        <span class="sr-only">Toggle navigation</span>
      </a>
		<span class="economic">贷款管理</span>
		<div class="account">
			<img src="img/num.png">
			<span class="fl hidePeople">在线人数：</span>
			<span>1000</span></div>
    </nav>
  </header>
  <aside class="main-sidebar">
    <section class="sidebar">
      <div class="user-panel">
        <img src="img/headImg.png" style="width: 100px;height: 100px;
        	display: block;margin: 0 auto;"/>
        	<p class="jyName">洁源-张小艺
        		<img src="img/arrow.png" class="fr"/>
        	</p>
      </div>
      <ul class="sidebar-menu" data-widget="tree">
        <li class="treeview">
          <a href="#">
            <i>
            	<img src="img/home.png" class="test"/></i>
            	<span>首页</span>
           		<span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li class="active"><a href="index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
            <li><a href="index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#">
            <i>
            	<img src="img/test.png" class="test"/></i>
            	<span class="testText">经济测算</span>
           		<span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li class="active"><a href="index.html"><i class="fa fa-circle-o"></i> Dashboard v1</a></li>
            <li><a href="index2.html"><i class="fa fa-circle-o"></i> Dashboard v2</a></li>
          </ul>
        </li>
		<li class="treeview">
          <a href="#">
           <i>
            	<img src="img/management.png" class="test"/></i>
            	<span>贷款管理</span>
           		<span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
            <li class="treeview">
              <a href="#"><i class="fa fa-circle-o"></i> Level One
                <span class="pull-right-container">
                  <i class="fa fa-angle-left pull-right"></i>
                </span>
              </a>
              <ul class="treeview-menu">
                <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
                <li class="treeview">
                  <a href="#"><i class="fa fa-circle-o"></i> Level Two
                    <span class="pull-right-container">
                      <i class="fa fa-angle-left pull-right"></i>
                    </span>
                  </a>
                  <ul class="treeview-menu">
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#">
           <i>
            	<img src="img/userCenter.png" class="test"/></i>
            	<span>用户中心</span>
           		<span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
            <li class="treeview">
              <a href="#"><i class="fa fa-circle-o"></i> Level One
                <span class="pull-right-container">
                  <i class="fa fa-angle-left pull-right"></i>
                </span>
              </a>
              <ul class="treeview-menu">
                <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
                <li class="treeview">
                  <a href="#"><i class="fa fa-circle-o"></i> Level Two
                    <span class="pull-right-container">
                      <i class="fa fa-angle-left pull-right"></i>
                    </span>
                  </a>
                  <ul class="treeview-menu">
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#">
           <i>
            	<img src="img/log.png" class="test"/></i>
            	<span>操作日志</span>
           		<span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
            <li class="treeview">
              <a href="#"><i class="fa fa-circle-o"></i> Level One
                <span class="pull-right-container">
                  <i class="fa fa-angle-left pull-right"></i>
                </span>
              </a>
              <ul class="treeview-menu">
                <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
                <li class="treeview">
                  <a href="#"><i class="fa fa-circle-o"></i> Level Two
                    <span class="pull-right-container">
                      <i class="fa fa-angle-left pull-right"></i>
                    </span>
                  </a>
                  <ul class="treeview-menu">
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
          </ul>
        </li>
        <li class="treeview">
          <a href="#">
           <i>
            	<img src="img/system.png" class="test"/></i>
            	<span>系统管理</span>
           		<span class="pull-right-container">
              <i class="fa fa-angle-left pull-right"></i>
            </span>
          </a>
          <ul class="treeview-menu">
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
            <li class="treeview">
              <a href="#"><i class="fa fa-circle-o"></i> Level One
                <span class="pull-right-container">
                  <i class="fa fa-angle-left pull-right"></i>
                </span>
              </a>
              <ul class="treeview-menu">
                <li><a href="#"><i class="fa fa-circle-o"></i> Level Two</a></li>
                <li class="treeview">
                  <a href="#"><i class="fa fa-circle-o"></i> Level Two
                    <span class="pull-right-container">
                      <i class="fa fa-angle-left pull-right"></i>
                    </span>
                  </a>
                  <ul class="treeview-menu">
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                    <li><a href="#"><i class="fa fa-circle-o"></i> Level Three</a></li>
                  </ul>
                </li>
              </ul>
            </li>
            <li><a href="#"><i class="fa fa-circle-o"></i> Level One</a></li>
          </ul>
        </li>
      </ul>
    </section>
  </aside>
  <div class="content-wrapper">
    <section class="content-header">
    </section>
    <section class="content">
      <div class="row">
		<div class="col-lg-12 col-md-12">
			<div class="result">
				<div class="resultL fl"><img src="img/compact.png"><span>合同签署</span></div>
			</div>
		</div>
	</div>
	<div class="row">
		<div class="box-header">
              <h3 class="box-title">
              	填写合同信息
              </h3>
            </div>
	</div>
      <div class="row updateMar">
        <div class="col-lg-4 col-md-4">
          <div class="box marBottom">
            
            <div class="box-body no-padding">
              <table class="table table-condensed table1">
                <tbody>
                	<tr>
                  <td class="bjBlue">类型</td>
                  <td>
                  	<select name="">
                  		<option value="长期贷款">长期贷款</option>
                  		<option value="直租">直租</option>
                  		<option value="回租">回租</option>
                  	</select>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">融资比例</td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="70%"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">放款金额</td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="20,000.00"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">还款期(不含宽限期)</td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="14年"/>
                  </td>
                </tr>
              </tbody></table>
            </div>
          </div>
         
        </div>
        <div class="col-lg-4 col-md-4">
          <div class="box marBottom">
            
            <div class="box-body no-padding">
              <table class="table table-condensed table1">
                <tbody>
                	<tr>
                  <td class="bjBlue">金融机构</td>
                  <td>
                  	<input type="text" name="" id="" value="" placeholder="工商银行"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">合同签订日</td>
                  <td>
                   <input type="text" name="" id="signa" value="" placeholder="选择时间"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">还款方式</td>
                  <td>
                    <select name="">
                    	<option value="等额本金">等额本金</option>
                    	<option value="等额本息">等额本息</option>
                    </select>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">浮动比例</td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="10%"/>
                  </td>
                </tr>
              </tbody></table>
            </div>
          </div>
         
        </div>
<div class="col-lg-4 col-md-4">
          <div class="box marBottom">
            
            <div class="box-body no-padding">
              <table class="table table-condensed table1">
                <tbody>
                	<tr>
                  <td class="bjBlue">支行名称</td>
                  <td>
                  	<input type="text" name="" id="" value="" placeholder="工商银行四川省分行"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">宽限期</td>
                  <td>
                   <input type="text" name="" id="" value="" placeholder="1年"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">合同利率</td>
                  <td>
                    <select name="">
                    	<option value="基准">基准</option>
                    	<option value="浮动">浮动</option>
                    </select>
                  </td>
                </tr>
               
              </tbody></table>
            </div>
          </div>
         
        </div>
</div>
	<div class="row">
		<div class="box-header">
              <h3 class="box-title">
              	其他费用
              </h3>
        </div>
	</div>
	<div class="row">
		<div class="col-lg-12 col-md-12">
          <div class="box marBottom">
            
            <div class="box-body no-padding">
              <table class="table table-condensed table2">
                <tbody>
                	<tr class="addBJ">
                  <td class="delBor">费用名称</td>
                  <td>
                  	支付日期
                  </td>
                  <td>
                  	金额
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">手续费</td>
                  <td>
                    <input type="text" name="" id="poundage" value="" placeholder="选择时间"/>
                  </td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="70%" />
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">保证金</td>
                  <td>
                    <input type="text" name="" id="Bond" value="" placeholder="选择时间" />
                  </td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="20,000.00"/>
                  </td>
                </tr>
                <tr>
                  <td class="bjBlue">货前息</td>
                  <td>
                    <input type="text" name="" id="delivery" value="" placeholder="选择时间"  />
                  </td>
                  <td>
                    <input type="text" name="" id="" value="" placeholder="14年"/>
                  </td>
                </tr>
              </tbody></table>
            </div>
          </div>
         
        </div>
	</div>
		<div class="subCom">
			<button>提交</button><button>取消</button>
		</div>
  </div>
    </section>		
</div>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/fastclick/lib/fastclick.js"></script>
<script src="dist/js/adminlte.js"></script>
<script src="js/calcRem.js" type="text/javascript" charset="utf-8"></script>
<script src="js/flatpickr.js" type="text/javascript" charset="utf-8"></script>
<script src="js/addcompact.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	$("#poundage").flatpickr();
	$("#Bond").flatpickr();
	$("#signa").flatpickr();
	$("#delivery").flatpickr();
</script>
	</body>
</html>

